<template>
  <div>
    <!-- <h1 align="center">123</h1> -->
    <div v-show="produceId != -1">
      <Produce ref="produce" @produceNoFound="produceNoFound" />
    </div>

    <div v-show="produceId == -1">
      <br />
      <br />
      <br />
      <br />
      <h1 style="font-size: 40px; " align="center">找不到商品</h1>
    </div>
  </div>
</template>

<script>
import Produce from "@/components/Produce";

export default {
  name: "App",
  data() {
    return {
      produceId: -1,
    };
  },
  components: {
    Produce,
  },
  methods: {
    produceNoFound() {
      this.produceId = -1;
    },
  },
  mounted() {
    console.log(process.env);
    // console.log(this.$route.query.produceId);

    if (this.$route.query.produceId == null) this.produceId = -1;
    else this.produceId = this.$route.query.produceId;

    // var store = {};
    // if(this.$route.query.storeId != null)
    //   store.storeId = this.$route.query.storeId;
    // if(this.$route.query.storeName != null)
    //   store.storeName = this.$route.query.storeName;
    // if(this.$route.query.storeIcon != null)
    //   store.storeIcon = this.$route.query.storeIcon;

    // this.$refs.produce.init(this.produceId, store);

    this.$refs.produce.init(this.produceId);
  },
};
</script>

<style scoped>
/* #app {
  font-family: 'Avenir', Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
} */
</style>
